<template>
	<view>
		<navigator v-if="!user" url="../login/login" hover-class="none">
		<view class="flex align-center p-3" hover-class="bg-light">
			<image src="/static/demo/userpic/11.jpg" style="width: 120rpx;height: 120rpx;" class="rounded-circle flex-shrink"></image>
			<view class="flex flex-column pl-3">
				<view class="font-lg text-main">登录</text></view>
				<view class="font text-muted line-h">
					清先登录
				</view>
			</view>
		</view>
		</navigator>
		<navigator v-else url="../user-space/user-space" hover-class="none">
		<view class="flex align-center p-3" hover-class="bg-light">
			<image src="/static/demo/userpic/11.jpg" style="width: 120rpx;height: 120rpx;" class="rounded-circle flex-shrink"></image>
			<view class="flex flex-column pl-3">
				<view class="font-lg">{{user.username||user.nickname}}<text class="text-muted font ml-3">男 贵州</text></view>
				<view class="font text-muted line-h">
					{{user.desc||'coding is loving'}}
				</view>
			</view>
		</view>
		</navigator>
		<view class="f-divider"></view>
		<uni-list-item title="我的作品" showExtraIcon showRight  @click="navigateTo('user-video')">
			<text slot="icon" class="iconfont iconshipin"></text>
			<text slot="right" class="font text-muted">{{videoCount}}</text>
		</uni-list-item>
		<uni-list-item title="收藏" showExtraIcon 
		@click="navigateTo('user-fava')">
			<text slot="icon" class="iconfont iconshoucang1"></text>
			<text slot="right" class="font text-muted">{{favaCount}}</text>
		</uni-list-item>
		<uni-list-item @click="navigateTo('follow')" title="关注" showExtraIcon>
			<text slot="icon" class="iconfont iconguanzhu"></text>
			<text slot="right" class="font text-muted">{{followCount}}</text>
		</uni-list-item>
		<uni-list-item title="历史记录"  @click="navigateTo('user-history')" showExtraIcon>
			<text slot="icon" class="iconfont iconlishi"></text>
		</uni-list-item>
		<view class="f-divider"></view>
		<main-big-button @click="add">立即投稿</main-big-button>
		
		<uni-popup ref="showpopup" type="bottom">
			<view class="bg-white">
				<view style="height: 200rpx;" 
				class="flex align-stretch">
					<view class="flex-1 flex flex-column align-center justify-center" hover-class="bg-light" @click="openCreate">
						<text class="iconfont icondingdanwenjian rounded-circle bg-primary text-white flex align-center justify-center"
						style="width: 80rpx;height: 80rpx;"
						></text>
						<text class="font text-secondary">单集</text>
					</view>
					<view class="flex-1 flex flex-column align-center justify-center" hover-class="bg-light" @click="openCreate">
						<text class="iconfont icon918caidan_wenjian rounded-circle bg-main text-white flex align-center justify-center"
						style="width: 80rpx;height: 80rpx;"
						></text>
						<text class="font text-secondary">连载</text>
					</view>
				</view>
				<view class="f-divider"></view>
				<view style="height: 100rpx;" @click="hide"
				class="flex align-center justify-center font-md"
				hover-class="bg-light">取消</view>
			</view>
		</uni-popup>
		
	</view>
</template>

<script>
	import uniListItem from '@/components/uni-ui/uni-list-item/uni-list-item.vue';
	import mainBigButton from '@/components/common/main-big-button.vue';
	import uniPopup from '@/components/uni-ui/uni-popup/uni-popup.vue';
	import {mapState} from 'vuex';
	export default {
		
		components: {
			uniListItem,
			mainBigButton,
			uniPopup
		},
		data() {
			return {
				followCount: 0, 
				videoCount: 0,
				favaCount:0
			}
		},
		computed:{
			...mapState({
				user:state=>state.user
			})
		},
		onShow(){
			this.$H.get('/user/statistics',{token:true,toast:false,noJump:true}).then(res=>{
				this.followCount=res.followCount
				this.videoCount=res.videoCount
				this.favaCount=res.favaCount
			})
		},
		onNavigationBarButtonTap(e) {
			if(e.index===0){
				uni.navigateTo({
					url:'../setting/setting'
				})
			}
		},
		methods: {
			navigateTo(path){
				this.authJump({
					url: `/pages/${path}/${path}`,
				})
			},
			// 立即投稿
			add(){
				this.$refs.showpopup.open()
			},
			// 隐藏投稿选项
			hide(){
				this.$refs.showpopup.close()
			},
			// 打开发布页
			openCreate(){
				uni.navigateTo({
					url: '../create/create',
					success: res => {
						this.hide()
					},
				});
			}
		}
	}
</script>

<style>

</style>
